<script setup>
import { useSettings } from '@/composables/useSettings'
const { isDark } = useSettings()
const font = reactive({
  color: 'rgba(0, 0, 0, 0.15)',
})
watch(isDark, () => {
  font.color = isDark.value ? 'rgba(255, 255, 255, 0.15)' : 'rgba(0, 0, 0, 0.15)'
}, { immediate: true })
</script>

<template>
  <el-watermark :font="font" content="demohui">
    <div></div>
  </el-watermark>
</template>